<template>
  <div class="customermanagementlist">
    <!-- 头部搜索部分 -->
    <!-- 头部内容 -->
    <div
      class="sharecontent_header"
      style="
        margin-bottom: 10px;
        overflow: hidden;
        height: 30px;
        display: flex;
        justify-content: space-between;
      "
    >
      <div class="sharecontent_header_right">
        <el-button
          data-tracker="P25-3"
          v-permission="'company_customer_create'"
          type="primary"
          @click="handleAddClick"
          >新增</el-button
        >
        <el-button
          data-tracker="P25-4"
          v-permission="'company_customer_delete'"
          type="primary"
          @click="handleDeleteClickFn"
          >删除</el-button
        >
      </div>
      <div style="display: flex">
        <div>
          <el-button
            type="primary"
            size="mini"
            @click="resultClickFn"
            style="margin: 0px 10px 0px 0px"
            >重置</el-button
          >
        </div>
        <div>
          <SettinUp
            :settype="29"
            :objSettinUpdata="objSettinUp"
            key="3"
          ></SettinUp>
        </div>
      </div>
    </div>
    <div>
      <TableHeader
        ref="TableHeaderList"
        :header_data_list="header_data_list"
        :HeaderData="HeaderData"
        :propMap="propMap"
        :objheader="objheader"
        @childEvent="handleDelete"
        @orderIdNumsEvent="handleDeleteType"
        :operation_type="operation_type"
        @handleClickDetail_second="handleClickDetail_second"
        @handleClickEdit_second="handleClickEdit_second"
        particulars="finance_invoice_book_list"
        redact="finance_invoice_book_update"
        :hasAccountBtn="true"
        @clickGoAccount="clickGoAccount"
      >
      </TableHeader>
    </div>
    <div class="sharecontent_heade_data">
      <el-pagination
        background
        small
        :current-page="pageNum"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="totalListNum"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </div>
    <el-drawer
      :title="usertitle"
      :visible.sync="dialogVisible"
      :direction="direction"
      size="930px"
      :before-close="handleClose"
      :key="data_type"
    >
      <div class="clientfound">
        <div style="margin-bottom: 10px">客户设置</div>
        <el-form
          :inline-message="false"
          class="demo-form-inline"
          label-width="90px"
          :model="ruleForm"
          :rules="rules"
          ref="ruleForm"
          :disabled="disableddata"
        >
          <el-form-item label="客户类型:" v-if="data_type == 1">
            <el-radio-group v-model="ruleForm.customer_type">
              <el-radio label="0">公司客户</el-radio>
              <el-radio label="2">个人客户</el-radio>
            </el-radio-group>
          </el-form-item>
          <!-- 客户类型公司 -->
          <div v-if="ruleForm.customer_type == '0'">
            <div>
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="客户名称:" prop="name">
                    <el-input
                      v-model="ruleForm.name"
                      placeholder="请输入合同签订的主体名称"
                    ></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="营业执照:">
                    <el-input
                      v-model="ruleForm.business_license"
                      placeholder="请输入营业执照"
                    ></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8"
                  ><el-form-item label="负责人:" prop="head">
                    <el-input
                      v-model="ruleForm.head"
                      placeholder="请输入负责人"
                    ></el-input> </el-form-item
                ></el-col>
              </el-row>
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="联系方式:" prop="head_mobile">
                    <el-input
                      v-model="ruleForm.head_mobile"
                      placeholder="请输入联系方式"
                    ></el-input> </el-form-item
                ></el-col>
                <el-col :span="8">
                  <el-form-item label="关联母公司:">
                    <el-select
                      v-model="ruleForm.parent_id"
                      remote
                      reserve-keyword
                      :remote-method="searchCustomerList"
                      filterable
                      placeholder="请选择客户的母公司"
                      @change="PagecustomerPeople"
                    >
                      <el-option
                        v-for="item2 in clientList"
                        :key="item2.id"
                        :label="item2.name"
                        :value="item2.id"
                      >
                      </el-option>
                    </el-select> </el-form-item
                ></el-col>
                <el-col :span="8"
                  ><el-form-item label="所属组织:" prop="branch_id">
                    <el-select
                      v-model="ruleForm.branch_id"
                      filterable
                      placeholder="请选择客户所属组织"
                    >
                      <el-option
                        v-for="item in reqWebsiteData"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                      ></el-option>
                    </el-select> </el-form-item
                ></el-col>
              </el-row>
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="所属销售:" prop="belong_id">
                    <el-select
                      v-model="ruleForm.belong_id"
                      filterable
                      placeholder="请选择客户所属销售"
                    >
                      <el-option
                        v-for="item in AdminBoxData"
                        :key="item.id"
                        :label="item.nickname"
                        :value="item.id"
                      ></el-option>
                    </el-select> </el-form-item
                ></el-col>
              </el-row>
            </div>
            <div>
              <div style="margin-bottom: 10px">订单默认设置</div>
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="承运类型:">
                    <el-select
                      v-model="ruleForm.product_type_id"
                      filterable
                      placeholder="请选择承运类型"
                      @change="
                        selectTransportsType(ruleForm.product_type_id, 1)
                      "
                    >
                      <el-option
                        v-for="item in transportsType"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="温层:">
                    <el-select
                      clearable
                      v-model="ruleForm.order_default_params_info.thermosphere"
                      :disabled="is_incubator_true"
                      placeholder="请选择"
                    >
                      <el-option
                        v-for="item in ThermosphereType"
                        :key="item.item_code"
                        :label="item.item_name"
                        :value="item.item_code"
                      >
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="送货方式:">
                    <el-select
                      v-model="
                        ruleForm.order_default_params_info.delivery_method
                      "
                    >
                      <el-option
                        v-for="type in deliveryMethodsList"
                        :key="type.item_code"
                        :label="type.item_name"
                        :value="type.item_code"
                      />
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="紧急度:">
                    <el-select
                      v-model="
                        ruleForm.order_default_params_info.priority_level
                      "
                      placeholder="请选择"
                    >
                      <el-option
                        v-for="item in order_priority_level"
                        :key="item.item_code"
                        :label="item.item_name"
                        :value="item.item_code"
                      >
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="揽收时间:">
                    <el-input
                      v-model="ruleForm.order_default_params_info.collect_time"
                      style="width: 79%"
                      placeholder="请输入账期时间"
                    ></el-input>
                    <span style="margin: 0px 0px 0px 5px">小时</span>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="时效:">
                    <el-input
                      v-model="ruleForm.valid_time"
                      style="width: 79%"
                      placeholder="时效"
                    ></el-input>
                    <span style="margin: 0px 0px 0px 5px">小时</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="24">
                <el-col :span="8"
                  ><el-form-item label="付款方式:">
                    <el-select
                      v-model="ruleForm.payment"
                      filterable
                      placeholder="请选择付款方式"
                    >
                      <el-option
                        v-for="item in pay_way"
                        :key="item.item_code"
                        :label="item.item_name"
                        :value="item.item_code"
                      ></el-option>
                    </el-select> </el-form-item
                ></el-col>
                <el-col :span="8">
                  <el-form-item
                    label="账期时间:"
                    v-if="ruleForm.payment == 4"
                    prop="account_period_time"
                  >
                    <el-input
                      v-model="ruleForm.account_period_time"
                      style="width: 80%"
                      placeholder="请输入账期时间"
                      @blur="onInput"
                    ></el-input>
                    <span style="margin: 0px 0px 0px 5px">月</span>
                  </el-form-item></el-col
                >
              </el-row>
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="展示温度报告:" label-width="120px">
                    <el-radio-group
                      v-model="ruleForm.is_view_order_temperature_report"
                    >
                      <el-radio label="1">开启</el-radio>
                      <el-radio label="0">关闭</el-radio>
                    </el-radio-group>
                  </el-form-item></el-col
                >
                <el-col :span="8">
                  <el-form-item label="是否投保:" label-width="120px">
                    <el-radio-group
                      v-model="ruleForm.order_default_params_info.is_insure"
                    >
                      <el-radio label="1">是</el-radio>
                      <el-radio label="0">否</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="是否有客户回单:" label-width="120px">
                    <el-radio-group
                      v-model="
                        ruleForm.order_default_params_info.is_receipt_customer
                      "
                    >
                      <el-radio label="1">是</el-radio>
                      <el-radio label="0">否</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="是否有公司回单:" label-width="120px">
                    <el-radio-group
                      v-model="ruleForm.order_default_params_info.is_receipt_ds"
                    >
                      <el-radio label="1">是</el-radio>
                      <el-radio label="0">否</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
              </el-row>
            </div>
            <div>
              <div style="margin-bottom: 10px">短信设置</div>
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="短信设置" prop="sms_type">
                    <el-select
                      v-model="ruleForm.sms_type"
                      filterable
                      placeholder="是否发送短信"
                    >
                      <el-option
                        v-for="item in sms_type_list"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      ></el-option>
                    </el-select> </el-form-item
                ></el-col>
              </el-row>
              <el-row :gutter="24" v-if="ruleForm.sms_type == 1">
                <el-col :span="8">
                  <el-form-item label="发送周期" prop="sms_send_cycle">
                    <el-button
                      style="margin-left: 10px"
                      :class="{ 'is-active': ruleForm.sms_send_cycle === '1' }"
                      @click="ruleForm.sms_send_cycle = '1'"
                      >日</el-button
                    >
                    <el-button
                      @click="ruleForm.sms_send_cycle = '2'"
                      :class="{ 'is-active': ruleForm.sms_send_cycle === '2' }"
                      >周</el-button
                    >
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item
                    label="周几发送短信"
                    prop="sms_send_week"
                    v-if="ruleForm.sms_send_cycle == 2"
                    label-width="120px"
                  >
                    <el-select
                      v-model="ruleForm.sms_send_week"
                      filterable
                      placeholder="是否发送短信"
                    >
                      <el-option
                        v-for="item in sms_send_week_list"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="发送时间" prop="sms_send_time">
                    <el-time-picker
                      v-model="ruleForm.sms_send_time"
                      placeholder="任意时间点"
                      type="dates"
                      format="HH:mm"
                      value-format="HH:mm"
                      style="width: 90%"
                    >
                    </el-time-picker>
                  </el-form-item>
                </el-col>
              </el-row>
              <!-- <div v-if="ruleForm.sms_type == 1">
                
              
             
              </div> -->
            </div>
            <div v-if="data_type == 1">
              <div style="margin-bottom: 10px">
                账号信息
                <el-tooltip
                  placement="right-end"
                  effect="dark"
                  content="维护手机号后,可以使用手机号+密码/验证码登录"
                >
                  <i class="header-icon el-icon-info"></i>
                </el-tooltip>
              </div>
              <div>
                <el-button
                  @click="adduser(0)"
                  type="primary"
                  icon="el-icon-plus"
                  style="margin-bottom: 10px"
                  >添加账号</el-button
                >
                <div v-for="(itme, index) in ruleForm.account" :key="index">
                  <el-row>
                    <el-col :span="11">
                      <el-form-item
                        label="账号:"
                        :prop="'account.' + index + '.user_name'"
                        :rules="rules.user_name"
                      >
                        <el-input
                          v-model.trim="itme.user_name"
                          placeholder="请输入账号"
                        ></el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="11">
                      <el-form-item
                        label="密码:"
                        :prop="'account.' + index + '.password'"
                        :rules="rules.password"
                      >
                        <el-input
                          v-model="itme.password"
                          placeholder="请输入密码"
                        ></el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="11">
                      <el-form-item label="用户名:">
                        <el-input
                          v-model="itme.nickname"
                          placeholder="请输入用户名"
                        ></el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="11">
                      <el-form-item
                        label="手机号:"
                        :prop="'account.' + index + '.mobile'"
                        :rules="rules.mobile"
                      >
                        <el-input
                          v-model.trim="itme.mobile"
                          placeholder="请输入手机号"
                        ></el-input>
                      </el-form-item>
                    </el-col>
                    <el-col
                      :span="2"
                      style="padding-left: 10px"
                      v-if = "ruleForm.account.length > 1"
                    >
                      <el-button
                        type="primary"
                        icon="el-icon-minus"
                        circle
                        @click="startoff(index, 0)"
                      >
                      </el-button>
                    </el-col>
                  </el-row>
                </div>
              </div>
            </div>
          </div>
          <!-- 客户类型个人 -->
          <div v-if="ruleForm.customer_type == '2'">
            <el-form
              :model="personage"
              :rules="personagerules"
              ref="personage"
              label-width="90px"
              class="demo-ruleForm"
              :disabled="disableddata"
            >
              <div>
                <el-row :gutter="24">
                  <el-col :span="8">
                    <el-form-item label="客户名称:" prop="name">
                      <el-input
                        v-model="personage.name"
                        placeholder="请输入客户名称"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="联系方式:" prop="head_mobile">
                      <el-input
                        v-model="personage.head_mobile"
                        placeholder="请输入联系方式"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="所属组织:" prop="branch_id">
                      <el-select
                        v-model="personage.branch_id"
                        filterable
                        placeholder="请选择客户所属组织"
                      >
                        <el-option
                          v-for="item in reqWebsiteData"
                          :key="item.id"
                          :label="item.name"
                          :value="item.id"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="24">
                  <el-col :span="8">
                    <el-form-item label="所属销售:" prop="belong_id">
                      <el-select
                        v-model="personage.belong_id"
                        filterable
                        placeholder="请选择客户所属销售"
                      >
                        <el-option
                          v-for="item in AdminBoxData"
                          :key="item.id"
                          :label="item.nickname"
                          :value="item.id"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                </el-row>
              </div>
              <div>
                <div style="margin-bottom: 10px">订单默认设置</div>
                <el-row :gutter="24">
                  <el-col :span="8">
                    <el-form-item label="承运类型:">
                      <el-select
                        v-model="personage.product_type_id"
                        placeholder="请选择承运类型"
                        @change="
                          selectTransportsType(personage.product_type_id, 2)
                        "
                      >
                        <el-option
                          v-for="item in transportsType"
                          :key="item.id"
                          :label="item.name"
                          :value="item.id"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>

                  <el-col :span="8">
                    <el-form-item label="温层">
                      <el-select
                        clearable
                        v-model="
                          personage.order_default_params_info.thermosphere
                        "
                        :disabled="is_incubator_true"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="item in ThermosphereType"
                          :key="item.item_code"
                          :label="item.item_name"
                          :value="item.item_code"
                        >
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="送货方式:">
                      <el-select
                        v-model="
                          personage.order_default_params_info.delivery_method
                        "
                      >
                        <el-option
                          v-for="type in deliveryMethodsList"
                          :key="type.item_code"
                          :label="type.item_name"
                          :value="type.item_code"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="24">
                  <el-col :span="8">
                    <el-form-item label="紧急度:">
                      <el-select
                        v-model="
                          personage.order_default_params_info.priority_level
                        "
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="item in order_priority_level"
                          :key="item.item_code"
                          :label="item.item_name"
                          :value="item.item_code"
                        >
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="时效:">
                      <el-input
                        v-model="personage.valid_time"
                        style="width: 79%"
                        placeholder="请输入时效"
                      ></el-input>
                      <span style="margin: 0px 0px 0px 5px">小时</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="揽收时间:">
                      <el-input
                        v-model="
                          personage.order_default_params_info.collect_time
                        "
                        style="width: 79%"
                        placeholder="请输入揽收时间"
                      ></el-input>
                      <span style="margin: 0px 0px 0px 5px">小时</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="24">
                  <el-col :span="8">
                    <el-form-item label="付款方式:">
                      <el-select
                        v-model="personage.payment"
                        filterable
                        placeholder="请选择付款方式"
                      >
                        <el-option
                          v-for="item in pay_way"
                          :key="item.item_code"
                          :label="item.item_name"
                          :value="item.item_code"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item
                      label="账期时间:"
                      prop="account_period_time"
                      v-if="personage.payment == 4"
                    >
                      <el-input
                        v-model="personage.account_period_time"
                        style="width: 79%"
                        placeholder="请输入账期时间"
                        @blur="onInput"
                      ></el-input>
                      <span style="margin: 0px 0px 0px 5px">月</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="24">
                  <el-col :span="8">
                    <el-form-item label="展示温度报告:" label-width="120px">
                      <el-radio-group
                        v-model="personage.is_view_order_temperature_report"
                      >
                        <el-radio label="1">开启</el-radio>
                        <el-radio label="0">关闭</el-radio>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="是否投保:">
                      <el-radio-group
                        v-model="personage.order_default_params_info.is_insure"
                        label-width="120px"
                      >
                        <el-radio label="1">是</el-radio>
                        <el-radio label="0">否</el-radio>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="是否有客户回单:" label-width="120px">
                      <el-radio-group
                        v-model="
                          personage.order_default_params_info
                            .is_receipt_customer
                        "
                      >
                        <el-radio label="1">是</el-radio>
                        <el-radio label="0">否</el-radio>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="24">
                  <el-col :span="12">
                    <el-form-item label="是否有公司回单:" label-width="120px">
                      <el-radio-group
                        v-model="
                          personage.order_default_params_info.is_receipt_ds
                        "
                      >
                        <el-radio label="1">是</el-radio>
                        <el-radio label="0">否</el-radio>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>
                </el-row>
              </div>
              <div>
                <div style="margin-bottom: 10px">短信设置</div>
                <el-row :gutter="24">
                  <el-col :span="12">
                    <el-form-item label="短信设置" prop="sms_type">
                      <el-select
                        v-model="personage.sms_type"
                        filterable
                        placeholder="短信设置"
                      >
                        <el-option
                          v-for="item in sms_type_list"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="24" v-if="personage.sms_type == 1">
                  <el-col :span="8">
                    <el-form-item label="发送周期" prop="sms_send_cycle">
                      <el-button
                        style="margin-left: 10px"
                        :class="{
                          'is-active': personage.sms_send_cycle === '1',
                        }"
                        @click="personage.sms_send_cycle = '1'"
                        >日</el-button
                      >
                      <el-button
                        @click="personage.sms_send_cycle = '2'"
                        :class="{
                          'is-active': personage.sms_send_cycle === '2',
                        }"
                        >周</el-button
                      >
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item
                      label="周几发送短信"
                      prop="sms_send_week"
                      v-if="personage.sms_send_cycle == 2"
                      label-width="120px"
                    >
                      <el-select
                        v-model="personage.sms_send_week"
                        filterable
                        placeholder="是否发送短信"
                      >
                        <el-option
                          v-for="item in sms_send_week_list"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="发送时间" prop="sms_send_time">
                      <el-time-picker
                        v-model="personage.sms_send_time"
                        placeholder="任意时间点"
                        type="dates"
                        format="HH:mm"
                        value-format="HH:mm"
                        style="width: 80%"
                      >
                      </el-time-picker>
                    </el-form-item>
                  </el-col>
                </el-row>
                <div></div>
              </div>
              <!-- 添加账号信息 -->
              <div v-if="data_type == '1'">
                <div style="margin-bottom: 10px">
                  账号信息
                  <el-tooltip
                    placement="right-end"
                    effect="dark"
                    content="维护手机号后,可以使用手机号+密码/验证码登录"
                  >
                    <i class="header-icon el-icon-info"></i>
                  </el-tooltip>
                </div>
                <div>
                  <el-button
                    @click="adduser(2)"
                    type="primary"
                    icon="el-icon-plus"
                    style="margin-bottom: 10px"
                    >添加账号</el-button
                  >
                  <div v-for="(itme, index) in personage.account" :key="index">
                    <el-row>
                      <el-col :span="11">
                        <el-form-item
                          label="账号:"
                          :prop="'account.' + index + '.user_name'"
                          :rules="personagerules.user_name"
                        >
                          <el-input
                            v-model.trim="itme.user_name"
                            placeholder="请输入账号"
                          ></el-input>
                        </el-form-item>
                      </el-col>
                      <el-col :span="11">
                        <el-form-item
                          label="密码:"
                          :prop="'account.' + index + '.password'"
                          :rules="personagerules.password"
                        >
                          <el-input
                            v-model="itme.password"
                            placeholder="请输入密码"
                          ></el-input>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="11">
                        <el-form-item label="用户名:">
                          <el-input
                            v-model="itme.nickname"
                            placeholder="请输入用户名"
                          ></el-input>
                        </el-form-item>
                      </el-col>
                      <el-col :span="11">
                        <el-form-item
                          label="手机号:"
                          :prop="'account.' + index + '.mobile'"
                          :rules="personagerules.mobile"
                        >
                          <el-input
                            v-model.trim="itme.mobile"
                            placeholder="请输入手机号"
                          ></el-input>
                        </el-form-item>
                      </el-col>
                      <el-col
                        :span="2"
                        style="padding-left: 10px"
                        v-if="personage.account.length > 1"
                      >
                        <el-button
                          type="primary"
                          icon="el-icon-minus"
                          circle
                          @click="startoff(index, 2)"
                        >
                        </el-button>
                      </el-col>
                    </el-row>
                  </div>
                </div>
              </div>
            </el-form>
          </div>
        </el-form>
        <!--创建  -->
        <div v-if="data_type == 1">
          <div
            style="padding-bottom: 10px; text-align: center"
            v-if="ruleForm.customer_type == '0'"
          >
            <el-button
              data-tracker="P25-9"
              type="primary"
              @click="preservationClickFn('ruleForm')"
              >保存</el-button
            >
            <el-button data-tracker="P25-10" @click="handleClose('ruleForm')"
              >取 消</el-button
            >
          </div>
          <div
            style="padding-bottom: 10px; text-align: center"
            v-if="ruleForm.customer_type == '2'"
          >
            <el-button
              data-tracker="P25-9"
              type="primary"
              @click="preservationClickFn('personage')"
              >保存</el-button
            >
            <el-button data-tracker="P25-10" @click="handleClose('personage')"
              >取 消</el-button
            >
          </div>
        </div>
        <!-- 修改 -->
        <div v-if="data_type == 3">
          <div
            style="padding-bottom: 10px; text-align: center"
            v-if="ruleForm.customer_type == '0'"
          >
            <el-button
              data-tracker="P25-11"
              type="primary"
              @click="EditpreservationClickFn('ruleForm')"
              >确 定</el-button
            >
            <el-button data-tracker="P25-12" @click="handleClose('ruleForm')"
              >取 消</el-button
            >
          </div>
          <div
            style="padding-bottom: 10px; text-align: center"
            v-if="ruleForm.customer_type == '2'"
          >
            <el-button
              data-tracker="P25-11"
              type="primary"
              @click="EditpreservationClickFn('personage')"
              >确 定</el-button
            >
            <el-button data-tracker="P25-12" @click="handleClose('personage')"
              >取 消</el-button
            >
          </div>
        </div>
      </div>
    </el-drawer>

    <div class="drawer_box">
      <el-drawer
        title="查看订单运费权限"
        :visible.sync="drawerflagShow"
        :direction="direction"
        :before-close="drawerhandleClose"
        size="70%"
        :wrapperClosable="false"
      >
        <div>
          <div class="sharecontent_header_left" style="margin-bottom: 20px">
            <el-pagination
              small
              :current-page="drapageNum"
              :page-sizes="[10, 20, 50, 100]"
              :page-size="drapageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="dratotalListNum"
              @size-change="handleSizedraChange"
              @current-change="handleCurrentdraChange"
            />
          </div>
          <el-table
            ref="singleTabledrawer"
            :data="drawertableData"
            highlight-current-row
            style="width: 100%"
            border
            stripe
            @selection-change="handleSelectionDrawerChange"
          >
            <el-table-column type="selection" width="55"> </el-table-column>
            <el-table-column type="index" label="序号" width="50">
            </el-table-column>
            <el-table-column prop="order_no" label="订单号" width="220">
            </el-table-column>
            <el-table-column prop="sender_name" label="发货人" width="180">
            </el-table-column>
            <el-table-column prop="sender_phone" label="发货人电话" width="180">
            </el-table-column>
            <el-table-column prop="sender_address" label="发货地址" width="320">
            </el-table-column>
            <el-table-column prop="receiver_name" label="收货人" width="180">
            </el-table-column>
            <el-table-column
              prop="receiver_phone"
              label="收货人电话"
              width="180"
            >
            </el-table-column>
            <el-table-column
              prop="receiver_address"
              label="收货地址"
              width="320"
            >
            </el-table-column>
          </el-table>
        </div>
        <!-- <div class="formeSelect">
          <el-form :inline="true" class="demo-form-inline" label-width="120px" :model="ruleFormDrawer" :rules="rulesDrawer" ref="ruleFormDrawer">
            <el-form-item label="是否查看运费" prop="isviewfreight">
              <el-select v-model="ruleFormDrawer.isviewfreight">
                <el-option v-for="(item, index) in preservationData" :key="index" :value="item.item_code" :label="item.item_name"></el-option>
              </el-select>
            </el-form-item>
          </el-form>
        </div> -->
        <div class="footerwaybill">
          <div
            style="
              position: fixed;
              bottom: 10px;
              width: 60%;
              text-align: center;
            "
          >
            <el-button
              id="orderSave"
              type="primary"
              @click="OpenFullDrawerClickFn"
              v-loading.fullscreen.lock="fullscreenLoading"
              >保存</el-button
            >
            <el-button id="orderCancel" @click="DrawerClickcloseFn"
              >取消</el-button
            >
          </div>
        </div>
      </el-drawer>
    </div>
  </div>
</template>
<script>
import TableHeader from "@/page/orderform/components/TableHeader/tableheader.vue";
import SettinUp from "@/page/orderform/components/settingUp/settingUp.vue";
import {
  CustomerList,
  CustomerCreate,
  CustomerDetail,
  CustomerUpdate,
  CustomerDelete,
  getTransportsList,
  reqOrderFormData,
  getCustomerViewFreightAuthList,
  CustomerSubscription,
  reqWebsiteList,
  AdminBox,
} from "@/api/customer";
import { dictionaryBatch } from "@/api/waybill";
import { reqDictionaryOptions } from "@/api/earlywarning";
import { customerPeople } from "@/api/information";
import { mobileCount, UserCount } from "@/api/organization";
import md5 from "js-md5";
import { dictionanryList } from "@/page/material/common/common";

export default {
  name: "customermanagementlist",
  components: { TableHeader, SettinUp },
  data() {
    return {
      order_priority_level: [], //紧急度
      pay_way: [], //付款方式
      dialogVisible: false,
      dialogVisibleEdit: false,
      dialogVisibleDetail: false,
      drawerflagShow: false,
      fullscreenLoading: false, //loading遮罩层
      disableddata: false, //禁用
      data_type: "1", //数据状态 1 创建 2 详情 3修改
      direction: "rtl",
      drapageNum: 1, //目前在第几页
      dratotalListNum: 100, //列表总数
      drapageSize: 20, //一页多少条
      multipleSelection: [],
      dramultipleSelection: [],
      drawertableData: [],
      orderSearch: {
        name: "",
        head: "",
        head_mobile: "",
        branch: "",
        customer_type: "3",
      },
      clientListname: [
        {
          id: "3",
          name: "全部",
        },
        {
          id: "0",
          name: "公司客户",
        },
        {
          id: "2",
          name: "个人客户",
        },
      ],
      client_type: "0",
      usertitle: "客户",
      // 公司
      ruleForm: {
        name: "", //客户名称
        head: "", //负责人
        head_mobile: "", //负责人电话
        remark: "", //备注
        product_type_id: "", // 产品类型
        valid_time: "", //时效
        is_view_order_temperature_report: "1", //展示温度报告
        is_view_freight: "1", //是否可查看运费
        is_cod: 0,
        customer_type: "0", //0是公司  2是个人
        business_license: "", //营业执照号
        branch_id: "", // 所属组织
        belong_id: "", // 所属
        parent_id: "", //父公司id
        account: [
          {
            user_name: "", // 账号
            password: "", // 密码
            mobile: "", //手机号
            nickname: "", // 昵称
          },
        ],
        // 发送短信
        sms_type: "1", //是否发送短信 0不发送短信, 1发送服务评价短信
        sms_send_cycle: "2", //短信通知周期，1 日，2 周
        sms_send_week: "1", //周x发送短信，值1-7，如果sms_send_cycle = 2显示
        sms_send_time: "10:45", //发送时间，如10:45
        payment: "4", // 付款方式
        account_period_time: "",
        order_default_params_info: {
          waybill_product_type: "", // 产品类型
          aging: "", //时效
          thermosphere: "", // 温层
          collect_time: "", // 揽收时间：单位h，创建订单是在当前时间加上n小时
          is_insure: "0", // 是否投保
          delivery_method: "1", // 送货方式
          payment_id: "", // 付款方式
          is_receipt_customer: "1", // 是否有客户回单
          is_receipt_ds: "1", // 是否有公司回单
          priority_level: "0", // 紧急度
        },
      },
      rules: {
        name: [{ required: true, message: "客户名称", trigger: "blur" }],
        head: [{ required: true, message: "负责人", trigger: "blur" }],
        head_mobile: [{ required: true, message: "联系方式", trigger: "blur" }],
        user_name: [
          { required: true, message: "请输入用户名", trigger: "blur" },
          {
            validator: this.checkUser,
            trigger: "blur",
          },
        ],
        password: [{ required: true, message: "请输入密码", trigger: "blur" }],

        mobile: [
          { required: true, message: "请输入手机号", trigger: "blur" },
          {
            validator: this.checkMobile,
            trigger: "blur",
          },
        ],
        branch_id: [
          { required: true, message: "请输入所属组织", trigger: "change" },
        ],
        belong_id: [
          { required: true, message: "请选择所属销售", trigger: "change" },
        ],
        sms_send_cycle: [
          { required: true, message: "短信通知周期", trigger: "blur" },
        ],
        sms_send_week: [
          { required: true, message: "周几发送短信", trigger: "blur" },
        ],
        sms_send_time: [
          { required: true, message: "请输入发送时间", trigger: "blur" },
        ],
        account_period_time: [
          { required: true, message: "请输入账期时间", trigger: "blur" },
        ],
      },
      clientList: [], //客户管理
      // 个人
      personage: {
        name: "", //客户名称
        head: "", //负责人
        head_mobile: "", //负责人电话
        remark: "", //备注
        product_type_id: "", // 产品类型
        valid_time: "", //时效
        is_view_order_temperature_report: "1", //展示温度报告
        is_view_freight: "1", //是否可查看运费
        is_cod: 0,
        customer_type: "0", //0是公司  2是个人
        business_license: "", //营业执照号
        branch_id: "", // 所属组织
        belong_id: "", // 所属
        parent_id: "", //父公司id
        account: [
          {
            user_name: "", // 账号
            password: "", // 密码
            mobile: "", //手机号
            nickname: "", // 昵称
          },
        ],
        //
        // 发送短信
        sms_type: "1", //是否发送短信 0不发送短信, 1发送服务评价短信
        sms_send_cycle: "2", //短信通知周期，1 日，2 周
        sms_send_week: "1", //周x发送短信，值1-7，如果sms_send_cycle = 2显示
        sms_send_time: "10:45", //发送时间，如10:45
        payment: "4", // 付款方式
        account_period_time: "",
        order_default_params_info: {
          waybill_product_type: "", // 产品类型
          aging: "", //时效
          thermosphere: "", // 温层
          collect_time: "", // 揽收时间：单位h，创建订单是在当前时间加上n小时
          is_insure: "0", // 是否投保
          delivery_method: "1", // 送货方式
          payment_id: "", // 付款方式
          is_receipt_customer: "1", // 是否有客户回单
          is_receipt_ds: "1", // 是否有公司回单
          priority_level: "0", // 紧急度
        },
      },
      personagerules: {
        name: [{ required: true, message: "客户名称", trigger: "blur" }],
        head: [{ required: true, message: "负责人", trigger: "blur" }],
        head_mobile: [{ required: true, message: "联系方式", trigger: "blur" }],
        user_name: [
          { required: true, message: "请输入用户名", trigger: "blur" },
          {
            validator: this.checkUser,
            trigger: "blur",
          },
        ],
        password: [{ required: true, message: "请输入密码", trigger: "blur" }],

        mobile: [
          {
            validator: this.checkMobile,
            trigger: "blur",
          },
        ],
        branch_id: [
          { required: true, message: "请输入所属组织", trigger: "blur" },
        ],
        belong_id: [
          { required: true, message: "请输入所属销售", trigger: "blur" },
        ],
        sms_send_cycle: [
          { required: true, message: "短信通知周期", trigger: "blur" },
        ],
        sms_send_week: [
          { required: true, message: "周几发送短信", trigger: "blur" },
        ],
        sms_send_time: [
          { required: true, message: "请输入发送时间", trigger: "blur" },
        ],
        account_period_time: [
          { required: true, message: "请输入账期时间", trigger: "blur" },
        ],
      },
      ruleFormEdit: {
        name: "",
        head: "",
        head_mobile: "",
        remark: "",
        branch: "",
        sale: "",
        product_type: "",
        prescription: "",
        isviewfreight: "0",
      },
      rulesEdit: {
        name: [{ required: true, message: "请输入发货公司", trigger: "blur" }],
        head: [{ required: true, message: "请输入发货人", trigger: "blur" }],
        head_mobile: [
          { required: true, message: "请输入发货人电话", trigger: "blur" },
        ],
      },
      ruleFormDetail: {
        name: "",
        head: "",
        head_mobile: "",
        remark: "",
        branch: "",
        sale: "",
        creator_name: "",
        create_time: "",
        update_time: "",
        product_type: "",
        prescription: "",
        isviewfreight: "0",
      },
      rulesDetail: {},
      ruleFormDrawer: {
        isviewfreight: "0",
      },
      rulesDrawer: {},
      pageNum: 1, //目前在第几页
      totalListNum: 100, //列表总数
      pageSize: 20, //一页多少条
      tableData: [],
      editId: "",
      deleteId: [],
      customerId: [],
      dracustomerId: [],
      preservationData: [],
      transportsType: [], //承运产品类型
      customeridData: "",
      cainiaoShow: false,
      cainiaoshouwDetail: false,
      reqWebsiteData: [],
      AdminBoxData: [],
      sms_type_list: [
        {
          value: "0",
          label: "关闭",
        },
        {
          value: "1",
          label: "服务评价邀请",
        },
      ],
      sms_send_cycle_list: [
        {
          value: "1",
          label: "日",
        },
        {
          value: "2",
          label: "周",
        },
      ],
      sms_send_week_list: [
        {
          value: "1",
          label: "星期一",
        },
        {
          value: "2",
          label: "星期二",
        },
        {
          value: "3",
          label: "星期三",
        },
        {
          value: "4",
          label: "星期四",
        },
        {
          value: "5",
          label: "星期五",
        },
        {
          value: "6",
          label: "星期六",
        },
        {
          value: "7",
          label: "星期日",
        },
      ],
      //
      header_data_list: [],
      propMap: {},
      obj_list: {},
      HeaderData: [],
      waybillIdNums: [],
      totalPage: 0,
      operation_type: 1,
      ThermosphereType: [], //温层
      deliveryMethodsList: [], //送货方式
      is_incubator_true: false,
    };
  },

  filters: {
    sms_type_data(value) {
      switch (value) {
        case "0":
          return "关闭";
          break;
        case "1":
          return "服务评价邀请";
          break;
        default:
          return "关闭";
      }
    },
    sms_send_cycle_data(value) {
      console.log(value, "星期日");
      switch (value) {
        case "1":
          return "日";
          break;
        case "2":
          return "周";
          break;
        default:
          return "";
      }
    },
    sms_send_week_data(value) {
      switch (value) {
        case "1":
          return "星期一";
          break;
        case "2":
          return "星期二";
          break;
        case "3":
          return "星期三";
          break;
        case "4":
          return "星期四";
          break;
        case "5":
          return "星期五";
          break;
        case "6":
          return "星期六";
          break;
        case "7":
          return "星期日";
          break;
        default:
          return "";
      }
    },
  },
  mounted() {
    this.getThermosphereType(); //数据字典
    this.CustomerListFn(this.pageNum, this.pageSize);
    this.PreservationFn();
    this.getTransportsListFn();
    this.reqWebsiteListFn();
    this.AdminBoxFn();
    this.pagedictionanryList(); //获取数据字典
  },
  methods: {
    clickGoAccount(row) {
      this.$router.push({
        name: "invoicebook",
        query: {
          activeName: "1",
          name: row.name,
        },
      });
    },
    // 检测手机号
    checkMobile(rule, val, cb) {
      if (val != "") {
        mobileCount({ mobile: val }).then((res) => {
          if (res.data.count > 0) {
            cb(new Error("手机号已绑定"));
          } else {
            cb();
          }
        });
      } else {
        cb();
      }
    },
    // 检查用户名是否重复
    checkUser(rule, val, cb) {
      UserCount({ username: val }).then((res) => {
        if (res.data > 0) {
          cb(new Error("用户名已存在"));
        } else {
          cb();
        }
      });
    },
    adduser(val) {
      if (val == "0") {
        this.ruleForm.account.push({
          user_name: "", // 账号
          password: "", // 密码
          mobile: "", //手机号
          nickname: "", // 昵称
        });
      }
      if (val == "2") {
        this.personage.account.push({
          user_name: "", // 账号
          password: "", // 密码
          mobile: "", //手机号
          nickname: "", // 昵称
        });
      }
    },
    // 客户管理的人
    PagecustomerPeople(val) {
      var param = {
        name: "",
      };
    },
    // 客户管理远程搜索
    searchCustomerList(query) {
      if (query != "") {
        var param = {
          name: query,
        };
        customerPeople(param).then((res) => {
          var res = res.data;
          this.clientList = res;
        });
      }
    },
    //获取大区接口
    reqWebsiteListFn() {
      let data = {
        branch_type: "3",
      };
      reqWebsiteList(data).then((res) => {
        if (res.code === 10000) {
          this.reqWebsiteData = res.data;
        }
      });
    },
    //获取员工
    AdminBoxFn() {
      let data = {
        user_type: "0",
      };
      AdminBox(data).then((res) => {
        if (res.code === 10000) {
          this.AdminBoxData = res.data;
        }
      });
    },
    //取消订阅弹出框
    handleCancelClickFn(val) {
      const data = {
        id: val.id.toString(),
      };
      this.$confirm(
        "用于取消阿里平台中客户的订购服务，请谨慎操作",
        "取消订阅",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      )
        .then(() => {
          CustomerSubscription(data).then((res) => {
            if (res.code === 10000) {
              this.$message({
                type: "success",
                message: `取消订阅成功`,
              });
              this.CustomerListFn(this.pageNum, this.pageSize);
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消操作",
          });
        });
    },
    //分配权限
    ViewPermissionsFn(val) {
      this.drawerflagShow = true;
      this.reqOrderFormDataFn(this.drapageNum, this.drapageSize, val.id);
      this.customeridData = val.id;
    },
    drawerhandleClose() {
      this.drawerflagShow = false;
      this.fullscreenLoading = false;
    },
    DrawerClickcloseFn() {
      this.drawerflagShow = false;
      this.fullscreenLoading = false;
    },
    handleSelectionDrawerChange(val) {
      this.dramultipleSelection = val;
      if (val.length > 0) {
        for (var i = 0; i < this.dramultipleSelection.length; i++) {
          this.dracustomerId = this.dramultipleSelection.map((item) =>
            Number(item.id)
          );
        }
      } else {
        this.dracustomerId = [];
      }
    },
    handleSizedraChange(val) {
      this.drapageSize = val; //一页多少条
      this.reqOrderFormDataFn(
        this.drapageNum,
        this.drapageSize,
        this.customeridData
      );
    },
    handleCurrentdraChange(val) {
      this.drapageNum = val; //第多少页
      this.reqOrderFormDataFn(
        this.drapageNum,
        this.drapageSize,
        this.customeridData
      );
    },
    //订单列表API
    reqOrderFormDataFn(pageNumval, pageSizeval, customerId) {
      const data = {
        page: pageNumval,
        page_size: pageSizeval,
        customer_id: customerId + "",
      };
      reqOrderFormData(data).then((res) => {
        if (res.code === 10000 && res.data.list !== null) {
          this.drawertableData = res.data.list;
          this.drapageNum = res.data.page;
          this.dratotalListNum = res.data.total;
          this.drapageSize = res.data.page_size;
          this.$nextTick(() => {
            for (const item of this.drawertableData) {
              if (item.is_view_freight === "1") {
                this.$refs.singleTabledrawer.toggleRowSelection(item, true);
              }
            }
          });
        } else {
          this.drapageNum = 1;
          this.dratotalListNum = 0;
          this.drapageSize = 20;
        }
      });
    },
    //分配绑定保存
    OpenFullDrawerClickFn() {
      const data = {
        customer_id: this.customeridData,
        is_view_freight: this.ruleFormDrawer.isviewfreight,
        order_ids: this.dracustomerId,
      };
      getCustomerViewFreightAuthList(data).then((res) => {
        if (res.code === 10000) {
          this.$message({
            message: "分配权限绑定成功",
            type: "success",
          });
          this.drawerflagShow = false;
          this.CustomerListFn(this.pageNum, this.pageSize);
        }
      });
    },
    getTransportsListFn() {
      const data = {
        is_all: false,
      };
      getTransportsList(data).then((res) => {
        if (res.code === 10000) {
          this.transportsType = res.data.data;
        }
      });
    },
    PreservationFn() {
      const data = {
        dictionary_code: "isViewfreight",
      };
      reqDictionaryOptions(data).then((res) => {
        if (res.code === 10000 || res.data.list.length > 0) {
          this.preservationData = res.data.list;
        }
      });
    },
    //重置按钮
    resultClickFn() {
      this.$refs.TableHeaderList.childMethod();
      this.pageNum = 1;
      this.pageSize = 20;
      this.CustomerListFn(this.pageNum, this.pageSize);
    },
    handleAddClick() {
      this.usertitle = "创建客户";
      this.dialogVisible = true;
      this.data_type = 1;
      // Object.assign(this.$data.ruleForm, this.$options.data().ruleForm);
      // Object.assign(this.$data.personage, this.$options.data().personage);
    },
    handleClose() {
      this.dialogVisible = false;
      this.disableddata = false;
      Object.assign(this.$data.ruleForm, this.$options.data().ruleForm);
      Object.assign(this.$data.personage, this.$options.data().personage);
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
      if (val.length > 0) {
        for (var i = 0; i < this.multipleSelection.length; i++) {
          this.customerId = this.multipleSelection.map((item) =>
            Number(item.id)
          );
        }
      } else {
        this.customerId = [];
      }
    },
    //取消
    dialogVisibleClickFn(formName) {
      this.dialogVisible = false;
      this.$refs[formName].resetFields();
    },
    //保存
    preservationClickFn(ruleForm) {
      if (this.ruleForm.sms_send_cycle == 1) {
        this.ruleForm.sms_send_week = "";
      } else {
        this.ruleForm.sms_send_week = this.ruleForm.sms_send_week;
      }
      if (this.personage.sms_send_cycle == 1) {
        this.personage.sms_send_week = "";
      } else {
        this.personage.sms_send_week = this.personage.sms_send_week;
      }
      var data = {};
      if (this.ruleForm.customer_type == "0") {
        var accountpassword = JSON.parse(JSON.stringify(this.ruleForm.account));
        accountpassword.find((item) => (item.password = md5(item.password)));
        var order_default_params_info_list = {
          ...this.ruleForm.order_default_params_info,
        };
        data = {
          name: this.ruleForm.name, //客户名称
          head: this.ruleForm.head, //负责人
          head_mobile: this.ruleForm.head_mobile, //负责人电话
          remark: this.ruleForm.remark, //备注
          product_type_id: this.ruleForm.product_type_id * 1, // 产品类型
          valid_time: this.ruleForm.valid_time * 1, //时效
          is_view_order_temperature_report:
            this.ruleForm.is_view_order_temperature_report, //展示温度
          is_view_freight: this.ruleForm.is_view_freight * 1, //是否可查看运费
          is_cod: 0,
          customer_type: this.ruleForm.customer_type, //0是公司  2是个人
          business_license: this.ruleForm.business_license, //营业执照号
          branch_id: this.ruleForm.branch_id * 1, // 所属组织
          belong_id: this.ruleForm.belong_id * 1, // 所属
          parent_id: this.ruleForm.parent_id + "", //父公司id
          account: accountpassword,
          sms_type: this.ruleForm.sms_type,
          sms_send_cycle: this.ruleForm.sms_send_cycle,
          sms_send_week: this.ruleForm.sms_send_week,
          sms_send_time: this.ruleForm.sms_send_time,
          payment: this.ruleForm.payment,
          account_period_time: this.ruleForm.account_period_time,
          order_default_params_info: order_default_params_info_list,
        };
      } else if (this.ruleForm.customer_type == "2") {
        var accountpassword = JSON.parse(
          JSON.stringify(this.personage.account)
        );
        accountpassword.find((item) => (item.password = md5(item.password)));
        var order_default_params_info_list = {
          ...this.personage.order_default_params_info,
        };
        data = {
          name: this.personage.name, //客户名称
          head: this.personage.name, //负责人
          head_mobile: this.personage.head_mobile, //负责人电话
          remark: this.personage.remark, //备注
          product_type_id: this.personage.product_type_id * 1, // 产品类型
          valid_time: this.personage.valid_time * 1, //时效
          is_view_order_temperature_report:
            this.personage.is_view_order_temperature_report, //展示温度
          is_view_freight: this.personage.is_view_freight * 1, //是否可查看运费
          is_cod: 0,
          customer_type: this.ruleForm.customer_type, //0是公司  2是个人
          business_license: this.personage.business_license, //营业执照号
          branch_id: this.personage.branch_id * 1, // 所属组织
          belong_id: this.personage.belong_id * 1, // 所属
          parent_id: this.personage.parent_id + "", //父公司id
          account: accountpassword,
          sms_type: this.personage.sms_type,
          sms_send_cycle: this.personage.sms_send_cycle,
          sms_send_week: this.personage.sms_send_week,
          sms_send_time: this.personage.sms_send_time,
          payment: this.personage.payment,
          account_period_time: this.personage.account_period_time,
          order_default_params_info: order_default_params_info_list,
        };
      } else {
        data = {};
      }
      this.$refs[ruleForm].validate((valid) => {
        if (valid) {
          CustomerCreate(data).then((res) => {
            if (res.code === 10000) {
              this.$message({
                message: "创建发货客户成功",
                type: "success",
              });
              this.dialogVisible = false;
              this.CustomerListFn(this.pageNum, this.pageSize);
              this.dialogVisibleClickFn("ruleForm");
            }
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    // 删除账号
    startoff(index, val) {
      if (val == "0") {
        this.ruleForm.account.splice(index, 1);
      } else if (val == "2") {
        this.personage.account.splice(index, 1);
      }
    },
    //详情按钮
    handleDetailFn(val) {
      this.usertitle = "客户详情";
      this.data_type = 2;
      const data = {
        id: val.id,
      };
      this.detailsList(data);
      this.dialogVisible = true;
      this.disableddata = true;
    },
    handleCloseDetail() {
      this.dialogVisibleDetail = false;
    },
    //编辑按钮
    handleEditchildren(val) {
      this.usertitle = "编辑客户";
      this.data_type = 3;
      this.editId = val.id;
      const data = {
        id: val.id,
      };
      this.detailsList(data);
      this.dialogVisible = true;
      this.disableddata = false;
    },
    // 数据列表
    detailsList(data) {
      CustomerDetail(data).then((res) => {
        if (res.code === 10000) {
          var res = res.data;
          this.ruleForm.customer_type = res.customer_type;
          if (res.customer_type == 0) {
            this.ruleForm.name = res.name; //客户名称
            this.ruleForm.head = res.head; //负责人
            this.ruleForm.head_mobile = res.head_mobile; //负责人电话
            this.ruleForm.remark = res.remark; //备注
            this.ruleForm.product_type_id =
              res.product_type_id == 0 ? "" : res.product_type_id + ""; // 产品类型
            this.ruleForm.valid_time =
              res.valid_time == 0 ? "" : res.valid_time; //时效
            this.ruleForm.is_view_order_temperature_report =
              res.is_view_order_temperature_report; //温度
            this.ruleForm.is_view_freight = res.is_view_freight + ""; //是否可查看运费
            this.ruleForm.business_license =
              res.business_license == 0 ? "" : res.business_license; //营业执照号
            this.ruleForm.branch_id = res.branch_id == 0 ? "" : res.branch_id; // 所属组织
            this.ruleForm.belong_id = res.belong_id == 0 ? "" : res.belong_id; // 所属
            this.searchCustomerList(res.parent_id_name); // 调用模糊搜索函数
            this.ruleForm.parent_id = res.parent_id == 0 ? "" : res.parent_id; //父公司id
            this.ruleForm.sms_type = res.sms_type;
            this.ruleForm.sms_send_cycle = res.sms_send_cycle;
            this.ruleForm.sms_send_week =
              res.sms_send_week == 0 ? "" : res.sms_send_week;
            this.ruleForm.sms_send_time = res.sms_send_time;
            this.ruleForm.payment = res.payment;
            this.ruleForm.account_period_time = res.account_period_time;
            this.ruleForm.order_default_params_info = {
              ...res.order_default_params_info,
            };
            this.ruleForm.order_default_params_info.thermosphere =
              res.order_default_params_info.thermosphere == 0
                ? ""
                : res.order_default_params_info.thermosphere;
            this.selectTransportsType(res.product_type_id, 1);
          } else if (res.customer_type == 2) {
            (this.personage.name = res.name), //客户名称
              (this.personage.head = res.head), //负责人
              (this.personage.head_mobile = res.head_mobile), //负责人电话
              (this.personage.remark = res.remark), //备注
              (this.personage.product_type_id =
                res.product_type_id == 0 ? "" : res.product_type_id + ""), // 产品类型
              (this.personage.valid_time =
                res.valid_time == 0 ? "" : res.valid_time), //时效
              (this.personage.is_view_order_temperature_report =
                res.is_view_order_temperature_report), //温度
              (this.personage.is_view_freight = res.is_view_freight + ""), //是否可查看运费
              (this.personage.business_license =
                res.business_license == 0 ? "" : res.business_license), //营业执照号
              (this.personage.branch_id =
                res.branch_id == 0 ? "" : res.branch_id), // 所属组织
              (this.personage.belong_id =
                res.belong_id == 0 ? "" : res.belong_id), // 所属
              (this.personage.parent_id =
                res.parent_id == 0 ? "" : res.parent_id); //父公司id、
            this.personage.sms_type = res.sms_type;
            this.personage.sms_send_cycle = res.sms_send_cycle;
            this.personage.sms_send_week =
              res.sms_send_week == 0 ? "" : res.sms_send_week;
            this.personage.payment = res.payment;
            this.personage.account_period_time = res.account_period_time;
            this.personage.order_default_params_info = {
              ...res.order_default_params_info,
            };
            this.personage.order_default_params_info.thermosphere =
              res.order_default_params_info.thermosphere == 0
                ? ""
                : res.order_default_params_info.thermosphere;
            this.selectTransportsType(res.product_type_id, 2);
          } else {
          }
        }
      });
    },
    handleCloseEdit() {
      this.dialogVisibleEditClickFn("ruleForm");
    },
    dialogVisibleEditClickFn(ruleForm) {
      this.dialogVisible = false;
      this.$refs[ruleForm].resetFields();
    },
    // 修改的接口
    EditpreservationClickFn(ruleForm) {
      if (this.ruleForm.sms_send_cycle == 1) {
        this.ruleForm.sms_send_week = "";
      } else {
        this.ruleForm.sms_send_week = this.ruleForm.sms_send_week;
      }
      if (this.personage.sms_send_cycle == 1) {
        this.personage.sms_send_week = "";
      } else {
        this.personage.sms_send_week = this.personage.sms_send_week;
      }
      var data = {};
      if (this.ruleForm.customer_type == "0") {
        var order_default_params_info_list = {
          ...this.ruleForm.order_default_params_info,
        };
        data = {
          id: this.editId * 1,
          name: this.ruleForm.name, //客户名称
          head: this.ruleForm.head, //负责人
          head_mobile: this.ruleForm.head_mobile, //负责人电话
          remark: this.ruleForm.remark, //备注
          product_type_id: this.ruleForm.product_type_id * 1, // 产品类型
          valid_time: this.ruleForm.valid_time * 1, //时效
          is_view_order_temperature_report:
            this.ruleForm.is_view_order_temperature_report, //时效
          is_view_freight: this.ruleForm.is_view_freight * 1, //是否可查看运费
          is_cod: 0,
          customer_type: this.ruleForm.customer_type, //0是公司  2是个人
          business_license: this.ruleForm.business_license, //营业执照号
          branch_id: this.ruleForm.branch_id * 1, // 所属组织
          belong_id: this.ruleForm.belong_id * 1, // 所属
          parent_id: this.ruleForm.parent_id + "", //父公司id
          account: this.ruleForm.account,
          sms_type: this.ruleForm.sms_type,
          sms_send_cycle: this.ruleForm.sms_send_cycle,
          sms_send_week: this.ruleForm.sms_send_week,
          sms_send_time: this.ruleForm.sms_send_time,
          payment: this.ruleForm.payment,
          account_period_time: this.ruleForm.account_period_time,
          order_default_params_info: order_default_params_info_list,
        };
      } else if (this.ruleForm.customer_type == "2") {
        var order_default_params_info_list = {
          ...this.personage.order_default_params_info,
        };
        data = {
          id: this.editId,
          name: this.personage.name, //客户名称
          head: this.personage.name, //负责人
          head_mobile: this.personage.head_mobile, //负责人电话
          remark: this.personage.remark, //备注
          product_type_id: this.personage.product_type_id * 1, // 产品类型
          valid_time: this.personage.valid_time * 1, //时效
          is_view_order_temperature_report:
            this.personage.is_view_order_temperature_report, //时效
          is_view_freight: this.personage.is_view_freight * 1, //是否可查看运费
          is_cod: 0,
          customer_type: this.ruleForm.customer_type, //0是公司  2是个人
          business_license: this.personage.business_license, //营业执照号
          branch_id: this.personage.branch_id * 1, // 所属组织
          belong_id: this.personage.belong_id * 1, // 所属
          parent_id: this.personage.parent_id + "", //父公司id
          account: this.personage.account,
          sms_type: this.personage.sms_type,
          sms_send_cycle: this.personage.sms_send_cycle,
          sms_send_week: this.personage.sms_send_week,
          sms_send_time: this.personage.sms_send_time,
          payment: this.personage.payment,
          account_period_time: this.personage.account_period_time,
          order_default_params_info: order_default_params_info_list,
        };
      } else {
        data = {};
      }
      this.$refs[ruleForm].validate((valid) => {
        if (valid) {
          CustomerUpdate(data).then((res) => {
            if (res.code === 10000) {
              this.$message({
                message: "编辑发货客户成功",
                type: "success",
              });
              this.dialogVisibleEdit = false;
              this.CustomerListFn(this.pageNum, this.pageSize);
              this.dialogVisibleEditClickFn("ruleForm");
            }
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    //单个行内删除按钮
    // handleDeleteFn(val) {
    //   this.deleteId.push(Number(val.id));
    //   const data = {
    //     ids: this.deleteId,
    //   };
    //   CustomerDelete(data).then((res) => {
    //     if (res.code === 10000) {
    //       this.$message({
    //         message: "删除发货客户成功",
    //         type: "success",
    //       });
    //       this.CustomerListFn(this.pageNum, this.pageSize);
    //     }
    //   });
    // },
    //批量删除按钮操作
    handleDeleteClickFn() {
      const data = {
        ids: this.waybillIdNums,
      };
      if (this.waybillIdNums.length > 0) {
        CustomerDelete(data).then((res) => {
          if (res.code === 10000) {
            this.$message({
              message: "删除发货客户成功",
              type: "success",
            });
            this.CustomerListFn(this.pageNum, this.pageSize);
          }
        });
      } else {
        this.$message({
          message: "请至少勾选一条数据进行删除",
          type: "warning",
        });
      }
    },
    handleSizeChange(val) {
      this.pageSize = val; //一页多少条
      this.CustomerListFn(this.pageNum, this.pageSize);
    },
    handleCurrentChange(val) {
      this.pageNum = val; //第多少页
      this.CustomerListFn(this.pageNum, this.pageSize);
    },
    CustomerListFn(pageNumval, pageSizeval) {
      const data = {
        page: pageNumval,
        page_size: pageSizeval,
        header_id: 29 + "",
        ...this.obj_list,
        // name: this.orderSearch.name,
        // head: this.orderSearch.head,
        // head_mobile: this.orderSearch.head_mobile,
        // branch_id: Number(this.orderSearch.branch),
        // customer_type:
        //   this.orderSearch.customer_type == 3
        //     ? ""
        //     : this.orderSearch.customer_type, // 0是公司 2是个人
      };
      CustomerList(data).then((res) => {
        if (res.code === 10000) {
          this.orders = res.data.list || [];
          this.orders.unshift({});
          this.header_data_list = this.orders;
          this.HeaderData = res.data.item_list;
          this.Fntransformation(this.HeaderData);
          this.totalListNum = res.data.pagination.total;
          // this.tableData = res.data.list;
          // this.pageNum = res.data.pagination.current_page;
          // this.totalListNum = res.data.pagination.total;
          // this.pageSize = res.data.pagination.per_page_count;
        }
      });
    },
    objheader(obj) {
      var data = {
        header_id: 29 + "",
        page: this.pageNum,
        page_size: this.pageSize,
        ...obj,
      };
      this.obj_list = obj;
      CustomerList(data).then((res) => {
        this.header_data_list = res.data.list;
        if (res.code === 10000 && res.data.list !== null) {
          this.header_data_list.unshift({});
          this.totalListNum = res.data.pagination.total;
          console.log(res.data.pagination, " res.data.pagination");
          this.pageNum = res.data.pagination.current_page;
          this.pageSize = res.data.pagination.per_page_count;
        } else {
          this.header_data_list = [{}];
          this.totalListNum = 0;
          this.orderslength = 0;
        }
      });
    },
    Fntransformation(obj) {
      const result = {};
      for (const prop in obj) {
        if (obj.hasOwnProperty(prop)) {
          if (obj[prop].send_name !== "") {
            result[obj[prop].name] = obj[prop].show_name;
          } else {
            result[obj[prop].name] = obj[prop].name;
          }
        }
      }
      this.propMap = result;
    },
    handleDelete(index, id, type) {
      this.handleJumpDetail(id);
    },
    handleDeleteType(value) {
      this.waybillIdNums = value;
    },
    handleClickDetail_second(val) {
      this.handleDetailFn(val);
    },
    handleClickEdit_second(val) {
      this.handleEditchildren(val);
    },
    objSettinUp() {
      this.CustomerListFn(this.pageNum, this.pageSize);
    },
    // 数据字典
    pagedictionanryList() {
      // thermosphere 温度 humidity 湿度 delivery_method 送货方式 order_priority_level 紧急度
      // transport_way 运输方式 pay_way 付款方式  order_type 运单类型 cost 费用 Package_model 包装
      var param = ["pay_way"];
      dictionanryList(param).then((res) => {
        var res = res.data.list;
        var payList = [];
        res.pay_way.forEach((element) => {
          if (element.item_code != "0") {
            payList.push(element);
          }
        });

        this.pay_way = payList;
      });
    },
    onInput(event) {
      // 使用正则表达式检查输入是否符合要求
      if (this.ruleForm.customer_type == "0") {
        const input = this.ruleForm.account_period_time;
        const regex = /^(?!.*\..*\.)[0-9](\.[0-9])?$/;
        if (regex.test(input)) {
          this.ruleForm.account_period_time = this.ruleForm.account_period_time;
        } else {
          // 如果不符合要求，移除最后一个输入字符
          this.ruleForm.account_period_time = "";
          this.$message({
            message: "账期时间最小0.1个月最大9.9个月",
            type: "warning",
          });
        }
      } else if (this.ruleForm.customer_type == "2") {
        const input = this.personage.account_period_time;
        const regex = /^(?!.*\..*\.)[0-9](\.[0-9])?$/;
        if (regex.test(input)) {
          this.personage.account_period_time =
            this.personage.account_period_time;
        } else {
          // 如果不符合要求，移除最后一个输入字符
          this.personage.account_period_time = "";
          this.$message({
            message: "账期时间最小0.1个月最大9.9个月",
            type: "warning",
          });
        }
      }
    },
    async getThermosphereType() {
      let result1 = await dictionaryBatch({
        codes: ["thermosphere", "delivery_method", "order_priority_level"],
      });
      this.ThermosphereType = result1.data.list.thermosphere;
      this.deliveryMethodsList = result1.data.list.delivery_method;
      this.order_priority_level = result1.data.list.order_priority_level;
    },
    selectTransportsType(val, type) {
      console.log(val, "vajlkjdlfkjasd");
      var is_insure_value = this.transportsType.find((item) => item.id == val);
      if (is_insure_value && is_insure_value.is_incubator == "0") {
        if (type == 1) {
          this.is_incubator_true = true;
          this.ruleForm.order_default_params_info.thermosphere = "8";
        } else if (type == 2) {
          this.is_incubator_true = true;
          this.personage.order_default_params_info.thermosphere = "8";
        }
      } else {
        if (type == 1) {
          this.is_incubator_true = false;
          // this.ruleForm.order_default_params_info.thermosphere = ""
        } else if (type == 2) {
          this.is_incubator_true = false;
          // this.personage.order_default_params_info.thermosphere = ""
        }
      }
    },
  },
};
</script>
<style lang="less" scoped>
/deep/.el-form-item {
  width: 100% !important;
}

/deep/.serach_box .el-form-item__content {
  width: 70% !important;
}

/deep/.serach_box .el-input {
  width: 100% !important;
}

/deep/.pop_box .el-form-item__content {
  width: 70% !important;
}

/deep/.drawer_box .el-drawer__body {
  overflow-x: hidden !important;
}

.sharecontent_heade_data {
  display: flex;
  justify-content: flex-end;
  margin: 10px 0px 0px 0px;
}

.customermanagementlist {
  padding: 10px 15px;
  background-color: #fff;

  .shareheader {
    margin: 0 auto;

    .shareheader_top {
      display: flex;
      flex-wrap: wrap;
    }
  }

  .sharecontent_header_left {
    float: right;
    padding: 0px 8px 0px 0px;
  }
}

.formeSelect {
  margin-top: 20px;
}

.clientfound {
  width: 95%;
  // background: rgb(175, 194, 34);
  height: 100%;
  margin: 0 auto;
}
</style>